<template>
    <div class="map2" id="mapContainer2"></div>
</template>

<script>
const center = [120.6, 27.83];
export default {
    data(){
        return{
            imagelayer: "",
            radarDS: [],
            map2:'',
        }
    },
    methods:{
        mapRender() {
            let that = this
            this.map2 = QXMap.Map("mapContainer2", {
              center: center,
              zoom: 7,
              maptype: QMAP_NORMAL_MAP
            });
            const areaCode = "330300000";
            var option = {
              isshowname: false,
              weight: 2,
              fillOpacity: 0,
              fillColor: "#fff",
              opacity: 1,
              color: "red",
              linestyle: "solid" //dot
            };
            QXMap.RegionLayer(areaCode, option, function(regionLayer) {
                that.map2.addVectorLayer(regionLayer);
                that.louderRender()
            });
            
        },
        louderRender(){
            let timeArr = ['20200406150000','20200406160000'];
            var mapProductOptions = {
                productcategory: "fy2fir1",
                begintime: timeArr[0],
                endtime: timeArr[1],
                limit: 24
            };
            let that = this;
            var products = QXMap.GetMapProductList(mapProductOptions, function(data) {
                if (data.RetrunCode == 0) {
                  let timeCur = data.TimeList[0];
                  var sate = QXMap.SateLayer(
                    mapProductOptions.productcategory,
                    timeCur
                  );
                  that.imagelayer = sate;
                  that.map2.addTileLayer(that.imagelayer);
                }
            });
        }
    },
    mounted(){
        // console.log(QXMap)
        this.mapRender()
    }
}
</script>
<style>
    span[title="平台贡献者：杨明"]{
        display:none;
    }
</style>
<style lang="scss" scoped>
    .map2{
        width:100%;
        height:100%;
    }
</style>